<!doctype html> 
<html> 
<head> 

    <meta charset="utf-8"> 
    <title></title> 
    <style type="text/css">
*{margin: 0;padding: 0;list-style: none;}
body,html{height: 100%;}
body{
}

div{
	width: 100px;height: 100px;background: black;
}
.f2{
	background: pink;
}





    </style>
</head>
<body>
<div class='f1 f2' id='s'>
</div>
<script type="text/javascript">
	
	s.onclick = function(){
		//this.setAttribute('class','f2');
		if(this.className){
			this.className += ' f2';
		}
		else{
			this.className += 'f2';
		}
	}
</script>
</body>
</html>